class AcGameMenu {
    constructor(root) {
        this.root = root;
        this.$menu = $(`
<div class="ac-game-menu">
    <div class="ac-game-menu-field">
        <div class="ac-game-menu-field-item ac-game-menu-field-item-single-mode">
            单人模式
        </div>
        <br>
        <div class="ac-game-menu-field-item ac-game-menu-field-item-multi-mode">
            多人模式
        </div>
        <br>
        <div class="ac-game-menu-field-item ac-game-menu-field-item-settings">
            退出
        </div>
    </div>
    <div class="ac-game-menu-music-control" id="music-control">
        🎵：关
    </div>
    <div class="ac-game-menu-game-control">
        <div class="ac-game-menu-game-control-button">
            操作方式
        </div>
        <div class="ac-game-menu-game-control-message" style="display: none;">
            <div class="desktop-control">
                pc:<br>
                    移动方式：鼠标右击<br>
                    发射火球：q+鼠标左击
               <br>
                phone：<br>
                    移动方式：虚拟摇杆<br>
                    发射火球：射击按钮
            </div>
        </div>
    </div>
    <div class="ICP-Number">
        <a href="http://beian.miit.gov.cn/" target="_blank">
            豫ICP备2025150101号-1
        </a>
        <br>
        <a href="https://beian.mps.gov.cn/#/query/webSearch" target="_blank"> 
            豫公网安备41061102000475号
        </a>
    </div>
</div>
`);
        this.hide();
        this.root.$ac_game.append(this.$menu);
        this.$single_mode = this.$menu.find('.ac-game-menu-field-item-single-mode');
        this.$multi_mode = this.$menu.find('.ac-game-menu-field-item-multi-mode');
        this.$settings = this.$menu.find('.ac-game-menu-field-item-settings');
        this.$music_control = this.$menu.find('.ac-game-menu-music-control');
        this.$game_control_button = this.$menu.find('.ac-game-menu-game-control-button');
        this.$game_control_message = this.$menu.find('.ac-game-menu-game-control-message');

        this.start();
    }

    start() {
        this.add_listening_events();
    }



    add_listening_events() {
        let outer = this;
        this.$single_mode.click(function() {
            outer.hide();
            outer.root.playground.show();
        });
        this.$multi_mode.click(function() {
            console.log("click multi mode");
        });
        this.$settings.click(function() {
            console.log("click settings");
            outer.root.menu.hide();
            outer.root.settings.logout_on_remote();
        });
        // 添加音乐控制点击事件
        this.$music_control.click(function() {
            const isPlaying = outer.root.toggleMusic();
            if (isPlaying) {
                outer.$music_control.html("🎵：开");
            } else {
                outer.$music_control.html("🎵：关");
            }
        });
        // 添加操作方式点击事件
        this.$game_control_button.click(function() {
            // 判断操作说明当前是否可见，如果可见则隐藏，否则显示
            if (outer.$game_control_message.is(':visible')) {
                outer.$game_control_message.hide();
            } else {
                outer.$game_control_message.show();
            }
        });
    }
    show() { // 显示menu界面
        this.$menu.show();
    }
    hide() { // 关闭menu界面
        this.$menu.hide();
    }
}
